<%@ page contentType="text/html;charset=UTF-8"%>
<script language=javascript>
    function printpreview() {
        // 打印页面预览
        wb.execwb(7, 1);
    }

    function printit() {
        wb.ExecWB(6, 1);
        //if (confirm('确定打印吗？')){
        //    wb.ExecWB(6,1);
        //}
    }

</script>
<style>
    hr {
        margin-top: 1px;
        border-bottom: 1px solid #1BBC9B;
    }

    .list-group-horizontal .list-group-item {display: inline-block;border:none;}
    .list-group-horizontal .list-group-item{margin-right:50px;background:#5bc0de;position:relative;z-index:1;color:#fff;}
    .list-group-horizontal .list-group-item:nth-child(1){background:#5bc0de;}
    .list-group-horizontal .list-group-item:nth-child(2){background:#f0ad4e;}
    .list-group-horizontal .list-group-item:nth-child(3){background:#5cb85c;}
    .list-group-horizontal .list-group-item:nth-child(4){background:#cd853f;}
    .list-group-horizontal .list-group-item:nth-child(5){background:#5bc0de;}
    .list-group-horizontal .list-group-item:nth-child(6){background:#f0ad4e;}
    .list-group-horizontal .list-group-item:nth-child(7){background:#5cb85c;}
    .list-group-horizontal .list-group-item:nth-child(8){background:#cd853f;}
    .list-group-horizontal .list-group-item:nth-child(9){background:#5bc0de;}
    .list-group-horizontal .list-group-item:nth-child(10){background:#f0ad4e;}
    .list-group-horizontal .list-group-item:nth-child(11){background:#5cb85c;}
    .list-group-horizontal .list-group-item:nth-child(12){background:#cd853f;}
    .list-group-horizontal .list-group-item::after{position:absolute;content:'';z-index:0;width:0;height:0;right:-60px;top:0;border-top: 60px solid transparent;border-bottom: 60px solid transparent;}
    .list-group-horizontal .list-group-item:nth-child(1)::after{border-left: 60px solid #5bc0de;}
    .list-group-horizontal .list-group-item:nth-child(2)::after{border-left: 60px solid #f0ad4e;}
    .list-group-horizontal .list-group-item:nth-child(3)::after{border-left: 60px solid #5cb85c;}
    .list-group-horizontal .list-group-item:nth-child(4)::after{border-left: 60px solid #cd853f;}
    .list-group-horizontal .list-group-item:nth-child(5)::after{border-left: 60px solid #5bc0de;}
    .list-group-horizontal .list-group-item:nth-child(6)::after{border-left: 60px solid #f0ad4e;}
    .list-group-horizontal .list-group-item:nth-child(7)::after{border-left: 60px solid #5cb85c;}
    .list-group-horizontal .list-group-item:nth-child(8)::after{border-left: 60px solid #cd853f;}
    .list-group-horizontal .list-group-item:nth-child(9)::after{border-left: 60px solid #5bc0de;}
    .list-group-horizontal .list-group-item:nth-child(10)::after{border-left: 60px solid #f0ad4e;}
    .list-group-horizontal .list-group-item:nth-child(11)::after{border-left: 60px solid #5cb85c;}
    .list-group-horizontal .list-group-item:nth-child(12)::after{border-left: 60px solid #cd853f;}
    .list-group-horizontal .list-group-item:last-child::after{border-left: 60px solid transparent;}
</style>
<style media="print">.noprint {
    DISPLAY: none
}</style>

    <!-------------------------- 审核面板  start--------------------------------->
    <form class="form-horizontal form-bordered form-row-strippe" name="shUpdate" id="shUpdate" mentod="post" role="form"
          data-toggle="validator" enctype="multipart/form-data">
        <div class="panel panel-primary">
            <div class="panel-body">
                <div class="row">
                    <h5>&nbsp;&nbsp;审核信息</h5>
                    <hr>
                    <div class="col-xs-6"><!--start 换列-->
                        <div class="col-xs-12">
                            <div class="form-group">
                                <label class="control-label col-xs-2"><font color="red">*</font> 审核意见</label>
                                <div class="col-xs-10">
                                    <textarea name="note" id="note" class="form-control" rows="3"></textarea>
                                    <input id="tninstanceid" name="tninstanceid" type="hidden"/>
                                    <input id="appid" name="appid" type="hidden"/>
                                    <input id="instanceid" name="instanceid" type="hidden" value="<%=request.getParameter("instanceid")%>"/>
                                    <input id="biztype" name="biztype" type="hidden" value=""/>
                                </div>
                            </div>
                        </div>
                        <!--如果输入元素是偶数个元素，在n=size/2?int时输出2列格式；如果元素是奇数个，需要在n=size/2?int时输出2列格式；需要换列，每行最多显示2列-->
                    </div><!--end 换列--><!--start 换列-->
                    <div class="col-xs-6" id="shNoteDiv">
                        <div class="col-xs-12">
                            <div id="checkButtonDiv" class="form-group" style="display: none" class="noprint">
<!--
                                <OBJECT id="wb" height="0" width="0" classid="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2" name="wb"></OBJECT>
                                    <input value="IE打印" type="button" class="btn btn-sm btn-primary" onclick="javascript:printit();"/>
                                    <input type=button name=button_show class="btn btn-sm btn-primary" value="打印预览" onclick="javascript:printpreview();">
                                    <input type=button name=button_fh class="btn btn-sm btn-primary" value="关闭" onclick="javascript:window.close();">
                                    <input type=button name=button_fh class="btn btn-sm btn-primary" value="普通打印" onclick="javascript:window.print();">
-->

                                <button type="button" class="btn btn-sm btn-success" onclick="shtg()" name="shtgButton"
                                        id="shtgButton">审核通过
                                </button>
                                <button type="button" class="btn btn-sm btn-danger" onclick="shth()" name="shthButton"
                                        id="shthButton">退回
                                </button>
                                <button type="button" class="btn btn-sm btn-danger" onclick="shthzfqr()" name="shthzfqrButton"
                                        id="shthzfqrButton">退回至发起人(流程结束)
                                </button>
                                <button type="button" class="btn btn-sm btn-primary" onclick="history.go(-1)">返回
                                </button>
                                <!--<input type=button name=button_fh class="btn btn-sm btn-primary" value="打印" onclick="javascript:window.print();">-->
                            </div>
                            <div id="hisButtonDiv" class="form-group">
                                <button type="button" class="btn btn-sm btn-primary" onclick="history.go(-1)">返回
                                </button>
                                <!--<input type=button name=button_fh class="btn btn-sm btn-primary" value="打印" onclick="javascript:window.print();">-->
                            </div>

                        </div>
                    </div><!--end 换列-->
                </div><!--end row-->
            </div><!--end body-->
        </div>
    </form>
    <!--------------------------审核面板 end------------------------------------>

    <!-------------------------- 流程图信息面板  start--------------------------------->
    <div class="panel panel-primary">
        <div class="panel-body">
            <div class="row">
                <h5>&nbsp;&nbsp;审核流程信息</h5>
                <hr>


                <div class="col-xs-12 col-sm-12">

                    <div class="list-group list-group-horizontal" id="grid_process_body"></div>

                </div>
            </div><!--end row-->
        </div><!--end body-->
    </div>
    <!--------------------------流程图信息面板 end------------------------------------>

    <!-------------------------- 历史审核意见面板  start--------------------------------->
    <div class="panel panel-primary">
        <div class="panel-body">
            <div class="row">
                <h5>&nbsp;&nbsp;历史审核信息</h5>
                <hr>
                <table id="grid" class="table table-condensed table-striped table-bordered table-hover" class="sortable"
                       cellpadding="0" cellspacing="0" border="0" class="display" width="100%">
                    <thead id="grid_head">
                    <tr>
                        <th onclick="sortTableT.sort('grid',0,'String')">审核流水号</th>
                        <th onclick="sortTableT.sort('grid',0,'String')">审核时间</th>
                        <th onclick="sortTableT.sort('grid',0,'String')">审核人</th>
                        <th onclick="sortTableT.sort('grid',0,'String')">审核结果</th>
                        <th onclick="sortTableT.sort('grid',0,'String')">审核岗位</th>
                        <th onclick="sortTableT.sort('grid',0,'String')">审核意见</th>
                        <th onclick="sortTableT.sort('grid',0,'String')">流程名称</th>
                    </tr>
                    </thead>
                    <tbody id="grid_body"></tbody>
                </table>

            </div><!--end row-->
        </div><!--end body-->
    </div>
    <!--------------------------历史审核意见面板 end------------------------------------>


<script src="<%=basePath%>js/bootstrap.min.js"></script>
<!--<script src="<%=basePath%>js/jquery-1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="js/bootstrapValidator.js"></script>-->
<script src="<%=basePath%>js/bootstrap-paginator.min.js"></script>
<script src="<%=basePath%>/js/respond.js"></script>
<script src="<%=basePath%>/js/html5.js"></script>
<script src="<%=basePath%>js/toastr/toastr.js"></script>
<script src="<%=basePath%>js/bootbox.js"></script>
<script src="<%=basePath%>js/jquery.validate.js"></script>
<!-- <script src="<%=basePath%>js/additional-methods.min.js"></script> -->
<script src="<%=basePath%>js/my-jquery-curd.js"></script>
<script src="<%= basePath %>js/tableSortTool.js" ></script>
<script src="<%= basePath %>js/calendar.js" ></script>
<script type="text/javascript">


    //初始化页面加载表单值；
    $().ready(function () {
        //加载审核流程信息,加载历史审核意见
        SearchTaskNodes(0);
    }) //end funciton read;

    //加载历史审核意见并显示
    function SearchTaskNodes(startIndex) {
        var taskid = '<%=request.getParameter("taskid")%>';
        var pageSize = 1000;
        //var condition = $("#form1").serialize();
        var url = "<%=basePath%>t_task_node/getAllT_task_node?startIndex=0&pageSize=" + pageSize + "&taskid=" + taskid + "&time=" + Math.random();
        //alert(url);
        $.getJSON(url, function (data) {
            var str ="";// "<tr>";
            //1、表格行内容输出; 倒序输出，因为后台是倒序取得数据；已经改为顺序了；按照节点执行顺序；
            $.each(data.items.reverse(), function (i, item) {
            //$.each(data.items, function (i, item) {
                var userid= doNull(item.userid);
                if(userid==""||userid==null){
                    userid ="上级审批";
                }
                //str += "<td width='100px'>" + doNull(item.ext5) + "<br>" + doNull(item.nodename) + "<br>" + doNull(item.userid) + "</td>";
                str+="<div class=\"list-group-item\"><h4>&nbsp;" + doNull(item.ext5) + "</h4><p>&nbsp;" + doNull(item.nodename) + "</p><p><span class=\"label label-default\">&nbsp;" + userid + "</span></p></div>";
                if (i != data.items.length - 1) {
                    //str += "<td  width='50px' valign='middle' align='center'><br><img src='<%=basePath%>/images/jiantou3.jpg' width='30px' height='30px' ></td>"
                }
            });//end each data;
            //str += "</tr>";
            $("#grid_process_body").append(str);
            //加载历史审核意见
            SearchSHYJ(0);
        })//end getJSON;
    }

    //加载历史审核意见并显示
    function SearchSHYJ(startIndex) {
        var instanceid = '<%=request.getParameter("instanceid")%>';
        //var condition = $("#form1").serialize();
        var url = "<%=basePath%>workflow/getTaskNodeInstanceNoteList?startIndex=0&pageSize=1000&instanceid=" + instanceid + "&tninstancestatus=1,2,3&time=" + Math.random();
        $.getJSON(url, function (data) {
            //$("#pageSize").html(data.pageSize);
            $("#totalCount").html(data.totalCount);
            $("#totalPageNo").html(data.totalPageNo);
            $("#grid_body").html("");
            //1、表格行内容输出
            $.each(data.items, function (i, item) {
                var str = "<tr>";
                str += "<td>" + doNull(item.tninstanceid) + "</td>";
                str += "<td>" + doNull(item.updatetime) + "</td>";
                str += "<td>" + doNull(item.updater) + "</td>";
                if (item.tninstancestatus == 0) {
                    str += "<td><span class='label label-success'>审批中</span></td>";
                } else if (item.tninstancestatus == 1) {
                    str += "<td><span class='label label-success'>通过</span></td>";
                } else if (item.tninstancestatus == 2) {
                    str += "<td><span class='label label-danger'>已退回</span></td>";
                } else if (item.tninstancestatus == 3) {
                    str += "<td><span class='label label-danger'>已退回至发起人</span></td>";
                } else {
                    str += "<td><span class='label label-danger'></span></td>";
                }
                str += "<td>" + doNull(item.laststep) + "</td>";
                str += "<td>" + doNull(item.note) + "</td>";
                str += "<td>" + doNull(item.firststep) + "</td>";
                str += "</tr>";
                $("#grid_body").append(str);
            });//end each data;
        })//end getJSON;
    }
</script>
